<template>
  <div class="Body">
    <div class="search">
      <el-input
        placeholder="请输入进行搜索"
        v-model="input"
        clearable
        size="medium"
        style="width: 942px; margin-top: 36px"
      >
        <el-button
          type="primary"
          style="background-color:#409eff;width:80px"
          slot="append"
          icon="el-icon-search"
          @click="search()"
        ></el-button>
      </el-input>
    </div>
    <div class="pic">
      <template>
        <div class="lunbo">
          <a-carousel autoplay>
            <div><img :src="img1" alt="" style="width: 1200px; height: 700px" /></div>
            <div><img :src="img2" alt="" style="width: 1200px; height: 700px" /></div>
            <div><img :src="img3" alt="" style="width: 1200px; height: 700px" /></div>
            <div><img :src="img4" alt="" style="width: 1200px; height: 700px" /></div>
          </a-carousel>
        </div>
      </template>
    </div>
    <div class="table">
      <div class="t_left">
        <a-table :columns="columns" :data-source="data1">
          <a slot="name" slot-scope="text">{{ text }}</a>
		 
        </a-table>
      </div>
      <div class="t_right">
        <a-table :columns="dolumns" :data-source="data2">
          <a slot="name" slot-scope="text">{{ text }}</a>
        </a-table>
      </div>
    </div>
	
    <div class="logo">
      <div class="qiye">
        
        <a-card hoverable class="card">
          <img slot="cover" alt="example" :src="img1" style="margin-left: 6px;"/>
          <a-card-meta
            title="Card title"
            description="This is the description"
          ></a-card-meta>
        </a-card>
        <a-card hoverable class="card">
          <img slot="cover" alt="example" :src="img1" style="margin-left: 6px;" />
          <a-card-meta
            title="Card title"
            description="This is the description"
          ></a-card-meta>
        </a-card>
        <a-card hoverable class="card">
          <img slot="cover" alt="example" :src="img1" style="margin-left: 6px;" />
          <a-card-meta
            title="Card title"
            description="This is the description"
          ></a-card-meta>
        </a-card>
        <a-card hoverable class="card">
          <img slot="cover" alt="example" :src="img1" style="margin-left: 6px;" />
          <a-card-meta
            title="Card title"
            description="This is the description"
          ></a-card-meta>
        </a-card>
      </div>
      <div class="gaoxiao">
        
        <a-card hoverable class="card">
          <img slot="cover" alt="example" :src="img1" style="margin-left: 6px;" />
          <a-card-meta
            title="Card title"
            description="This is the description"
          ></a-card-meta>
        </a-card>
        <a-card hoverable class="card">
          <img slot="cover" alt="example" :src="img1" style="margin-left: 6px;" />
          <a-card-meta
            title="Card title"
            description="This is the description"
          ></a-card-meta>
        </a-card>
        <a-card hoverable class="card">
          <img slot="cover" alt="example" :src="img1" style="margin-left: 6px;" />
          <a-card-meta
            title="Card title"
            description="This is the description"
          ></a-card-meta>
        </a-card>
        <a-card hoverable class="card">
          <img slot="cover" alt="example" :src="img1" style="margin-left: 6px;" />
          <a-card-meta
            title="Card title"
            description="This is the description"
          ></a-card-meta>
        </a-card>
      </div>
    </div>
  </div>
</template>

<script>
// import Fliterss from "../index/fliter"
const columns = [
  {
    title: "职位名称",
    dataIndex: "name",
    key: "name",
    scopedSlots: { customRender: "name" },
  },
  {
    title: "公司部门",
    dataIndex: "apart",
    key: "apart",
  },
];
const dolumns = [
  {
    title: "姓名",
    dataIndex: "name",
    key: "name",
    scopedSlots: { customRender: "name" },
  },
  {
    title: "职位",
    dataIndex: "apart",
    key: "apart",
  },
  {
    title: "学历",
    dataIndex: "learn",
    key: "learn",
  },
];

const data1 = [
  {
    key: "1",
    name: "JAVA工程师",
    apart: "北京科技有限公司",
  },
  {
    key: "2",
    name: "前端工程师",
    apart: "北京科技有限公司",
  },
  {
    key: "3",
    name: "JAVA工程师",
    apart: "北京科技有限公司",
  },
];
const data2 = [
  {
    key: "1",
    name: "吴××",
    apart: "JAVA工程师",
    learn: "本科",
  },
  {
    key: "2",
    name: "",
    apart: "",
    learn: "",
  },
  {
    key: "3",
    name: "",
    apart: "",
    learn: "",
  },
];

export default {
  components: {},
  data() {
    return {
      img1: "https://pic3.zhimg.com/v2-831fca64031f66a69c523dae5a230e8a_r.jpg",
      img2:
        "https://up.enterdesk.com/edpic_source/ff/41/20/ff4120f6768de51334e6f5d508427bbf.jpg",
      img3:
        "https://up.enterdesk.com/edpic_source/37/46/af/3746afd841ced7b0b5a6d2b7f96a9c9a.jpg",
      img4:
        "https://up.enterdesk.com/edpic_source/be/85/30/be853001316e5d20f6440fe281ccf6bd.jpg",
      data1,
      data2,
      columns,
      dolumns,
      searchs: [],
      input: null,
      searchtableData: [
        {
          qiye:"企业",
          rencai:"人才",
          geren:"个人",
          zhuanjia:"专家",
          gongsi:"公司",
         
        },
      ],

    };
  },
  methods: {
    onSearch(value) {
      console.log(value);
    },
	
	
	
    handleClick(e) {
      console.log("click ", e);
    },
    search: function () {
      console.log(this.input);
      if(this.input=="企业"){
          this.$router.push("/loginregister");  
        }else if(this.input=="个人"){
          this.$router.push("/login");  
        }else if(this.input=="公司"){
          this.$router.push("/cybe");  
        }else if(this.input=="专家"){
          this.$router.push("/zj");
        }
      }
  },
};
</script>

<style scoped>
.search {
  height: 100px;
}

.ant-carousel >>> .slick-slide {
  text-align: center;
  height: 400px;
  line-height: 300px;
  /* background: #364d79; */
  overflow: hidden;
}

.ant-descriptions-bordered .ant-descriptions-item-label,
.ant-descriptions-bordered .ant-descriptions-item-content {
  padding: 16px 22px;
  border-right: 1px solid #e8e8e8;
}
.lunbo {
  width: 900px;
  margin-left: 42px;
  float: left;
  /* height: 600px; */
}

img {
  object-fit: contain;
}
table {
  width: 900px;
  height: 300px;
}
.t_left {
  width: 385px;
  margin-left: 42px;
  position: relative;
  top: 22px;
}
.t_right {
  width: 400px;
  float: right;
  /* position: relative; */
  /* top: -83px; */
  margin-top: -258px;
  margin-right: 84px;
}
.qiye,
.gaoxiao {
  width: 902px;
  height: 210px;
  /* border: 1px solid blue; */
  margin-top: 50px;
  margin-left: 47px;
}
h1 {
  float: left;
  padding-top: 80px;
  padding-right: 12px;
}
.card {
  width: 205px;
  height: 205px;
  float: left;
  padding-right: 10px;
  margin-left: 20px;
}

</style>
